import React, {Component} from 'react';
import {Tabbar, Swiper, Tabs, ProductCard  } from 'react-vant';
import {FriendsO, HomeO, Search, SettingO} from '@react-vant/icons';
import { items } from './items';
class Index extends Component {
    render() {
        return (
            <div>
                <Swiper autoplay={5000}>{items}</Swiper>

                <Tabs active={0}>
                    {[1, 2, 3].map((item) => (
                        <Tabs.TabPane key={item} title={`标签${item}`}>
                            内容 {item}
                        </Tabs.TabPane>
                    ))}
                </Tabs>

                <ProductCard
                    num="2"
                    price="2.00"
                    desc="描述信息"
                    title="商品名称"
                    thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
                />

                <ProductCard
                    num="2"
                    price="2.00"
                    desc="描述信息"
                    title="商品名称"
                    thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
                />

                <ProductCard
                    num="2"
                    price="2.00"
                    desc="描述信息"
                    title="商品名称"
                    thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
                />

                <Tabbar>
                    <Tabbar.Item icon={<HomeO/>}>首页</Tabbar.Item>
                    <Tabbar.Item icon={<Search/>}>分类</Tabbar.Item>
                    <Tabbar.Item icon={<FriendsO/>}>我的</Tabbar.Item>
                </Tabbar>

            </div>
        );
    }
}

export default Index;
